<!--
 * @Author: your name
 * @Date: 2021-12-16 15:55:43
 * @LastEditTime: 2021-12-16 16:01:16
 * @LastEditors: Please set LastEditors
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath: \day8vue3\my-app\src\components\Computed.vue
-->
/<template>
  <div>
      <p>{{count}}</p>
      <p>{{doubleCount}}</p>
      <button @click="changeCount">改变</button>
  </div>
</template>

<script>
import {ref,computed} from "vue"
export default {
    setup(){
        let count=ref(1);
        // 第一种方法  getteer
        // let doubleCount=computed(()=>count.value*2)

        let doubleCount=computed({
            get:()=>{
                return count.value*2
            },
            set(newval){
                // console.log(newval);
                count.value=newval
            }
        })
        const changeCount=()=>{
            count.value++
        }

        return {
            count,
            doubleCount,
            changeCount
        }
    }
}
</script>

<style>

</style>